<html>
<head>
	<meta charset="utf-8">
	<title>document操作节点</title>
	<script>
		function removeN() {
			var p = document.getElementsByTagName("p")[0] ;
			p.parentNode.removeChild(p) ;
		}
		function addN() {
			var newP = document.createElement("p") ;
			var textN = document.createTextNode("Hello World!") ;
			newP.appendChild(textN) ;
			document.body.insertBefore(newP,document.getElementsByTagName("p")[0]) ;
		}
		function replaceN() {
			var oldP = document.getElementsByTagName("p")[0] ;
			var newP = document.createElement("p") ;
			var newTextNode = document.createTextNode("你好，DOM!") ;
			newP.appendChild(newTextNode) ;
			document.body.replaceChild(newP,oldP) ;
		}
		function addN1() {
			var newN = document.createElement("p") ;
			var textN = document.createTextNode("你好，周杰伦") ;
			newN.appendChild(textN) ;
			var oBody = document.body ;
			oBody.appendChild(newN) ;
		}
	</script>
</head>
<body>
<p>Hello DOM!</p>
<input type="button" value="删除节点" onclick="removeN()" />
<input type="button" value="增加节点" onclick="addN()" />
<input type="button" value="替换节点" onclick="replaceN()" />
<input type="button" value="Add节点"  onclick="addN1()" />
</body>
</html>